<!DOCTYPE html>
<html lang="zh_cn">

<head>
    <mate charset="utf-8"></mate>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0" />
    <link rel="stylesheet" type="text/css" href="../css/base.css" />
    <link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon">
    <title></title>
    <style>
        .guatou {
            width: 100%;
            background-color: brown;
            position: relative;
            border-left: 3px solid black;
            border-right: 3px solid black;
            border-bottom: 3px solid black;
            box-sizing: border-box;
            font-size: 2rem;
            font-family: "楷体";
        }
        
        .guabody {
            width: 100%;
            position: relative;
            background-color: purple;
            box-sizing: border-box;
            height: auto;
            float: left;
            border-left: 3px solid black;
            border-right: 3px solid black;
        }
        
        .guabody>li {
            margin-top: 4%;
            display: block;
            position: relative;
            float: left;
            width: 20%;
            text-align: center;
            margin-left: 4%;
            background-color: bisque;
            border: 3px solid black;
            box-sizing: border-box;
            overflow: hidden;
            white-space: nowrap;
        }
        
        .guabody>li>a:link {
            color: black;
            font-weight: bold;
        }
        
        .guabody>li>a:hover {
            color: blue;
            font-weight: bold;
        }
        
        .guabody>li>a:active {
            color: red;
            font-weight: bold;
        }
        
        .guabody>li>a:visited {
            color: orange;
            font-weight: bold;
        }
        
        .guabody>li>a>img {
            margin-top: 1rem;
            position: relative;
            size: 50% 50%;
            width: 50%;
            height: auto;
        }
        
        .guabody>li>a>p {
            position: relative;
            text-align: center;
            font-size: 1rem;
            margin-bottom: 0.5rem;
        }
    </style>
</head>

<body>
    <div class="box">
        <header class="head">
            <a>
                <img id="logoimg" />
                <h1 id="logowz"></h1>
            </a>
        </header>
        <div class="guatou">六十四卦</div>
        <div class="guabody">
            <li>
                <a href="./bagua/1.html" title="乾卦"><img src="../images/bagua/1.gif" alt="乾卦">
                    <p>1.乾为天</p>
                </a>
            </li>
            <li>
                <a href="./bagua/2.html" title="坤卦"><img src="../images/bagua/2.gif" alt="坤卦">
                    <p>2.坤为地</p>
                </a>
            </li>
            <li>
                <a href="./bagua/3.html" title="屯卦"><img src="../images/bagua/3.gif" alt="屯卦">
                    <p>3.水雷屯</p>
                </a>
            </li>
            <li>
                <a href="./bagua/4.html" title="蒙卦"><img src="../images/bagua/4.gif" alt="蒙卦">
                    <p>4.山水蒙</p>
                </a>
            </li>
            <li>
                <a href="./bagua/5.html" title="需卦"><img src="../images/bagua/5.gif" alt="需卦">
                    <p>5.水天需</p>
                </a>
            </li>
            <li>
                <a href="./bagua/6.html" title="讼卦"><img src="../images/bagua/6.gif" alt="讼卦">
                    <p>6.天水讼</p>
                </a>
            </li>
            <li>
                <a href="./bagua/7.html" title="师卦"><img src="../images/bagua/7.gif" alt="师卦">
                    <p>7.地水师</p>
                </a>
            </li>
            <li>
                <a href="./bagua/8.html" title="比卦"><img src="../images/bagua/8.gif" alt="比卦">
                    <p>8.水地比</p>
                </a>
            </li>
            <li>
                <a href="./bagua/9.html" title="小畜卦"><img src="../images/bagua/9.gif" alt="小畜卦">
                    <p>9.风天小畜</p>
                </a>
            </li>
            <li>
                <a href="./bagua/10.html" title="履卦"><img src="../images/bagua/10.gif" alt="履卦">
                    <p>10.天泽履</p>
                </a>
            </li>
            <li>
                <a href="./bagua/11.html" title="泰卦"><img src="../images/bagua/11.gif" alt="泰卦">
                    <p>11.地天泰</p>
                </a>
            </li>
            <li>
                <a href="./bagua/12.html" title="否卦"><img src="../images/bagua/12.gif" alt="否卦">
                    <p>12.天地否</p>
                </a>
            </li>
            <li>
                <a href="./bagua/13.html" title="同人卦"><img src="../images/bagua/13.gif" alt="同人卦">
                    <p>13.天火同人</p>
                </a>
            </li>
            <li>
                <a href="./bagua/14.html" title="大有卦"><img src="../images/bagua/14.gif" alt="大有卦">
                    <p>14.火天大有</p>
                </a>
            </li>
            <li>
                <a href="./bagua/15.html" title="谦卦"><img src="../images/bagua/15.gif" alt="谦卦">
                    <p>15.地山谦</p>
                </a>
            </li>
            <li>
                <a href="./bagua/16.html" title="豫卦"><img src="../images/bagua/16.gif" alt="豫卦">
                    <p>16.雷地豫</p>
                </a>
            </li>
            <li>
                <a href="./bagua/17.html" title="随卦"><img src="../images/bagua/17.gif" alt="随卦">
                    <p>17.泽雷随</p>
                </a>
            </li>
            <li>
                <a href="./bagua/18.html" title="蛊卦"><img src="../images/bagua/18.gif" alt="蛊卦">
                    <p>18.山风蛊</p>
                </a>
            </li>
            <li>
                <a href="./bagua/19.html" title="临卦"><img src="../images/bagua/19.gif" alt="临卦">
                    <p>19.地泽临</p>
                </a>
            </li>
            <li>
                <a href="./bagua/20.html" title="观卦"><img src="../images/bagua/20.gif" alt="观卦">
                    <p>20.风地观</p>
                </a>
            </li>
            <li>
                <a href="./bagua/21.html" title="噬嗑卦"><img src="../images/bagua/21.gif" alt="噬嗑卦">
                    <p>21.火雷噬嗑</p>
                </a>
            </li>
            <li>
                <a href="./bagua/22.html" title="贲卦"><img src="../images/bagua/22.gif" alt="贲卦">
                    <p>22.山火贲</p>
                </a>
            </li>
            <li>
                <a href="./bagua/23.html" title="剥卦"><img src="../images/bagua/23.gif" alt="剥卦">
                    <p>23.山地剥</p>
                </a>
            </li>
            <li>
                <a href="./bagua/24.html" title="复卦"><img src="../images/bagua/24.gif" alt="复卦">
                    <p>24.地雷复</p>
                </a>
            </li>
            <li>
                <a href="./bagua/25.html" title="无妄卦"><img src="../images/bagua/25.gif" alt="无妄卦">
                    <p>25.天雷无妄</p>
                </a>
            </li>
            <li>
                <a href="./bagua/26.html" title="大畜卦"><img src="../images/bagua/26.gif" alt="大畜卦">
                    <p>26.山天大畜</p>
                </a>
            </li>
            <li>
                <a href="./bagua/27.html" title="颐卦"><img src="../images/bagua/27.gif" alt="颐卦">
                    <p>27.山雷颐</p>
                </a>
            </li>
            <li>
                <a href="./bagua/28.html" title="大过卦"><img src="../images/bagua/28.gif" alt="大过卦">
                    <p>28.泽风大过</p>
                </a>
            </li>
            <li>
                <a href="./bagua/29.html" title="坎卦"><img src="../images/bagua/29.gif" alt="坎卦">
                    <p>29.坎为水</p>
                </a>
            </li>
            <li>
                <a href="./bagua/30.html" title="离卦"><img src="../images/bagua/30.gif" alt="离卦">
                    <p>30.离为火</p>
                </a>
            </li>
            <li>
                <a href="./bagua/31.html" title="咸卦"><img src="../images/bagua/31.gif" alt="咸卦">
                    <p>31.泽山咸</p>
                </a>
            </li>
            <li>
                <a href="./bagua/32.html" title="恒卦"><img src="../images/bagua/32.gif" alt="恒卦">
                    <p>32.雷风恒</p>
                </a>
            </li>
            <li>
                <a href="./bagua/33.html" title="遁卦"><img src="../images/bagua/33.gif" alt="遁卦">
                    <p>33.天山遁</p>
                </a>
            </li>
            <li>
                <a href="./bagua/34.html" title="大壮卦"><img src="../images/bagua/34.gif" alt="大壮卦">
                    <p>34.雷天大壮</p>
                </a>
            </li>
            <li>
                <a href="./bagua/35.html" title="晋卦"><img src="../images/bagua/35.gif" alt="晋卦">
                    <p>35.火地晋</p>
                </a>
            </li>
            <li>
                <a href="./bagua/36.html" title="明夷卦"><img src="../images/bagua/36.gif" alt="明夷卦">
                    <p>36.地火明夷</p>
                </a>
            </li>
            <li>
                <a href="./bagua/37.html" title="家人卦"><img src="../images/bagua/37.gif" alt="家人卦">
                    <p>37.风火家人</p>
                </a>
            </li>
            <li>
                <a href="./bagua/38.html" title="睽卦"><img src="../images/bagua/38.gif" alt="睽卦">
                    <p>38.火泽睽</p>
                </a>
            </li>
            <li>
                <a href="./bagua/39.html" title="蹇卦"><img src="../images/bagua/39.gif" alt="蹇卦">
                    <p>39.水山蹇</p>
                </a>
            </li>
            <li>
                <a href="./bagua/40.html" title="解卦"><img src="../images/bagua/40.gif" alt="解卦">
                    <p>40.雷水解</p>
                </a>
            </li>
            <li>
                <a href="./bagua/41.html" title="损卦"><img src="../images/bagua/41.gif" alt="损卦">
                    <p>41.山泽损</p>
                </a>
            </li>
            <li>
                <a href="./bagua/42.html" title="益卦"><img src="../images/bagua/42.gif" alt="益卦">
                    <p>42.风雷益</p>
                </a>
            </li>
            <li>
                <a href="./bagua/43.html" title="夬卦"><img src="../images/bagua/43.gif" alt="夬卦">
                    <p>43.泽天夬</p>
                </a>
            </li>
            <li>
                <a href="./bagua/44.html" title="姤卦"><img src="../images/bagua/44.gif" alt="姤卦">
                    <p>44.天风姤</p>
                </a>
            </li>
            <li>
                <a href="./bagua/45.html" title="萃卦"><img src="../images/bagua/45.gif" alt="萃卦">
                    <p>45.泽地萃</p>
                </a>
            </li>
            <li>
                <a href="./bagua/46.html" title="升卦"><img src="../images/bagua/46.gif" alt="升卦">
                    <p>46.地风升</p>
                </a>
            </li>
            <li>
                <a href="./bagua/47.html" title="困卦"><img src="../images/bagua/47.gif" alt="困卦">
                    <p>47.泽水困</p>
                </a>
            </li>
            <li>
                <a href="./bagua/48.html" title="井卦"><img src="../images/bagua/48.gif" alt="井卦">
                    <p>48.水风井</p>
                </a>
            </li>
            <li>
                <a href="./bagua/49.html" title="革卦"><img src="../images/bagua/49.gif" alt="革卦">
                    <p>49.泽火革</p>
                </a>
            </li>
            <li>
                <a href="./bagua/50.html" title="鼎卦"><img src="../images/bagua/50.gif" alt="鼎卦">
                    <p>50.火风鼎</p>
                </a>
            </li>
            <li>
                <a href="./bagua/51.html" title="震卦"><img src="../images/bagua/51.gif" alt="震卦">
                    <p>51.震为雷</p>
                </a>
            </li>
            <li>
                <a href="./bagua/52.html" title="艮卦"><img src="../images/bagua/52.gif" alt="艮卦">
                    <p>52.艮为山</p>
                </a>
            </li>
            <li>
                <a href="./bagua/53.html" title="渐卦"><img src="../images/bagua/53.gif" alt="渐卦">
                    <p>53.风山渐</p>
                </a>
            </li>
            <li>
                <a href="./bagua/54.html" title="归妹卦"><img src="../images/bagua/54.gif" alt="归妹卦">
                    <p>54.雷泽归妹</p>
                </a>
            </li>
            <li>
                <a href="./bagua/55.html" title="丰卦"><img src="../images/bagua/55.gif" alt="丰卦">
                    <p>55.雷火丰</p>
                </a>
            </li>
            <li>
                <a href="./bagua/56.html" title="旅卦"><img src="../images/bagua/56.gif" alt="旅卦">
                    <p>56.火山旅</p>
                </a>
            </li>
            <li>
                <a href="./bagua/57.html" title="巽卦"><img src="../images/bagua/57.gif" alt="巽卦">
                    <p>57.巽为风</p>
                </a>
            </li>
            <li>
                <a href="./bagua/58.html" title="泽卦"><img src="../images/bagua/58.gif" alt="泽卦">
                    <p>58.兑为泽</p>
                </a>
            </li>
            <li>
                <a href="./bagua/59.html" title="涣卦"><img src="../images/bagua/59.gif" alt="涣卦">
                    <p>59.风水涣</p>
                </a>
            </li>
            <li>
                <a href="./bagua/60.html" title="节卦"><img src="../images/bagua/60.gif" alt="节卦">
                    <p>60.水泽节</p>
                </a>
            </li>
            <li>
                <a href="./bagua/61.html" title="中孚卦"><img src="../images/bagua/61.gif" alt="中孚卦">
                    <p>61.风泽中孚</p>
                </a>
            </li>
            <li>
                <a href="./bagua/62.html" title="小过卦"><img src="../images/bagua/62.gif" alt="小过卦">
                    <p>62.雷山小过</p>
                </a>
            </li>
            <li>
                <a href="./bagua/63.html" title="既济卦"><img src="../images/bagua/63.gif" alt="既济卦">
                    <p>63.水火既济</p>
                </a>
            </li>
            <li>
                <a href="./bagua/64.html" title="未济卦"><img src="../images/bagua/64.gif" alt="未济卦">
                    <p>64.火水未济</p>
                </a>
            </li>
            <li style="border: 0;"></li>
        </div>
        <div style="clear:both"></div>
        <div class="yqlj"></div>
        <div class="yqljjt1">
            <p></p>
            <p></p>
        </div>
    </div>
    <script src="../js/config.js"></script>
</body>

</html>